﻿<Page x:Name="page"
    x:Class="Microsoft.ALMRangers.VsarTreasureMap.WindowsStoreApp.Views.Projects"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Microsoft.ALMRangers.VsarTreasureMap.WindowsStoreApp.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:converters="using:Microsoft.ALMRangers.VsarTreasureMap.WindowsStoreApp.Converters"
    mc:Ignorable="d">
    <Page.Resources>
        <converters:BooleanToVisibility x:Key="trueMeansVisibleBooleanToVisibility" TrueMeansVisible="True"/>
        <converters:BooleanToVisibility x:Key="falseMeansVisibleBooleanToVisibility" TrueMeansVisible="False"/>
        <converters:MaterialTypeMetaConverter x:Key="displayNameMaterialTypeMetaConverter" ReturnDisplayName="True"/>
        <converters:MaterialTypeMetaConverter x:Key="imageMaterialTypeMetaConverter" ReturnDisplayName="False"/>
    </Page.Resources>
    <Page.TopAppBar>
        <AppBar Background="#FFFFFF">
            <StackPanel Orientation="Horizontal">
                <Button Command="{Binding GoToHome}" Style="{StaticResource HomeAppBarButtonStyle}" FontSize="26.667" Margin="40,0,0,0" Foreground="Black"/>
            </StackPanel>
        </AppBar>
    </Page.TopAppBar>
    <Page.BottomAppBar>
        <AppBar Background="#FFFFFF">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>
                <StackPanel Grid.Column="1" HorizontalAlignment="Right" Orientation="Horizontal">
                    <Button Command="{Binding PinProject}" Style="{StaticResource PinAppBarButtonStyle}" Foreground="Black"/>
                    <Button Visibility="{Binding IsFavourite, Converter={StaticResource trueMeansVisibleBooleanToVisibility}}" Command="{Binding ToggleFavourite}" Style="{StaticResource UnfavoriteAppBarButtonStyle}" Foreground="Black"/>
                    <Button x:Uid="/Content/AddAsFavourite" AutomationProperties.Name="Add as Favourite" Visibility="{Binding IsFavourite, Converter={StaticResource falseMeansVisibleBooleanToVisibility}}" Command="{Binding ToggleFavourite}" Style="{StaticResource FavoriteAppBarButtonStyle}" Foreground="Black"/>
                </StackPanel>
            </Grid>
        </AppBar>
    </Page.BottomAppBar>

    <Grid>
        <FlipView Background="{StaticResource BackgroundBrush}" ItemsSource="{Binding ProjectCollection}" SelectedItem="{Binding SelectedProject,Mode=TwoWay}">
            <FlipView.ItemTemplate>
                <DataTemplate>
                    <Grid MinWidth="1024" MinHeight="768">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="120"/>
                            <RowDefinition Height="20"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid Grid.Row="0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="140"/>
                                <ColumnDefinition  Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Button Command="{Binding DataContext.GoBack, ElementName=page}" Grid.Column="0" Style="{StaticResource BackButtonStyle}"  Margin="0,32,0,0" VerticalAlignment="Center" HorizontalAlignment="Center" />
                            <TextBlock Grid.Column="1" Style="{StaticResource PageHeaderTextStyle}" Text="{Binding Name}" Margin="0,0,0,20" FontFamily="{StaticResource TitleFont}" Foreground="{StaticResource TitleBrush}" />
                            <Button Grid.Column="1" Command="{Binding ElementName=page, Path=DataContext.LaunchSearch}" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="0,0,40,0" Style="{StaticResource TextButtonStyle}">
                                <TextBlock><Run FontFamily="Segoe UI Symbol" FontSize="24">&#xE11A;</Run><Run FontSize="24" xml:space="preserve"> Search</Run></TextBlock>
                            </Button>
                        </Grid>
                        <Grid Grid.Row="2" Margin="140,0,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="450"/>
                                <ColumnDefinition Width="20"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid Grid.Column="0">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="338"/>
                                    <RowDefinition Height="20"/>
                                    <RowDefinition Height="*"/>
                                </Grid.RowDefinitions>
                                <Image Grid.Row="0" Source="{Binding Image}" VerticalAlignment="Top" />
                                <TextBlock Grid.Row="2" Text="{Binding Description}" TextWrapping="Wrap" Style="{StaticResource BodyTextStyle}" Foreground="{StaticResource ContentForegroundBrush}"/>
                            </Grid>
                            <ListBox Grid.Column="2" HorizontalContentAlignment="Stretch" ItemsSource="{Binding Guidance}" BorderBrush="{x:Null}" ItemContainerStyle="{StaticResource ListBoxItemStyle}" Template="{StaticResource ListBoxControlTemplate}" Background="#00000000">
                                <ListBox.ItemTemplate>
                                    <DataTemplate>
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="57"/>
                                                <ColumnDefinition Width="5"/>
                                                <ColumnDefinition Width="*"/>
                                            </Grid.ColumnDefinitions>
                                            <Image Grid.Column="0" Source="{Binding GuidanceType, Converter={StaticResource imageMaterialTypeMetaConverter}}" HorizontalAlignment="Center" VerticalAlignment="Center" />
                                            <HyperlinkButton Grid.Column="2" CommandParameter="{Binding}" Command="{Binding ElementName=page, Path=DataContext.MarkGuidanceAsDone}" VerticalAlignment="Center" NavigateUri="{Binding Url}" Foreground="{StaticResource ContentForegroundBrush}" Style="{StaticResource HyperlinkButtonStyle}" RightTapped="HyperlinkButtonRightTapped">
                                                <TextBlock VerticalAlignment="Center" HorizontalAlignment="Left">
                                                    <Run Text="Find " />
                                                    <Run Text="{Binding GuidanceType, Converter={StaticResource displayNameMaterialTypeMetaConverter}}"/>
                                                    <Run Text=" here: "/>
                                                    <Run Text="{Binding Url}"/>
                                                </TextBlock>
                                            </HyperlinkButton>
                                        </Grid>
                                    </DataTemplate>
                                </ListBox.ItemTemplate>
                            </ListBox>
                        </Grid>
                    </Grid>
                </DataTemplate>
            </FlipView.ItemTemplate>
        </FlipView>
        
        <Popup HorizontalAlignment="Right" VerticalAlignment="Bottom" IsLightDismissEnabled="True" x:Name="hintPopup" Height="180" Width="360" Margin="0,0,80,80">
            <Grid Width="360" Height="180" Background="White">
                <Grid Margin="20" HorizontalAlignment="Center" VerticalAlignment="Center">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="10"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <TextBlock Foreground="Black" x:Uid="/Content/ProjectPageHint" TextWrapping="Wrap" Style="{StaticResource BasicTextStyle}">Did you know? The AppBar has additional functionality for you to use. You can pin this page to the start screen &amp; add this project to your favourites island.</TextBlock>
                    <Button Grid.Row="2" Click="ShowAppBar" HorizontalAlignment="Right" Style="{StaticResource DarkButtonStyle}">Open AppBar now</Button>
                </Grid>
            </Grid>
        </Popup>
    </Grid>
</Page>